<template>
  <a-card class="addHYmodel">
    <a-modal style="padding: 0;"
      title="挂号管理"
      :width="1200"
      :visible="modalMisible"
      :plain="true"
      :model="forms"
      @ok="submitOk"
      @cancel="modalMisible=false"
    >
      <a-card :bordered="false">
        <div class="table-page-search-wrapper">
          <a-form layout="inline" :model='form' @keyup.enter.native="searchQuery">
            <a-row :gutter="24">
               <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="号源医院" :required="true" hasFeedback>
                  <a-select v-model="registerHospitalId" style="width:140px;">
                    <a-select-option v-for="(item,index) in hospitals" :value="item.id" :key="item.id" @click="selectHospital(item)">{{ item.name }}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
               <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="医师服务类型" :required="true" hasFeedback >
                  <!-- <a-select v-model="type" @change="haozhongItem($event)">
                    <a-select-option v-for ="hzItem in haozhongList" :key="hzItem.id">{{hzItem.ghlbmc}}</a-select-option>
                  </a-select> -->
                  <a-select @change="fuwufeiItem($event)" v-model="type">
                    <a-select-option v-for ="hzItem in haozhongList" :key="hzItem.id" :value="hzItem.ghlbmc">{{hzItem.ghlbmc}}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :xl="4" :lg="7" :md="8" :sm="24">
                <a-form-item label="医师服务费" :required="true" :labelCol="labelCol" hasFeedback>
                  <a-input v-model="price" type="input" disabled="true" />
                </a-form-item>
              </a-col>
              <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="挂号类型" :required="true" hasFeedback >
                  <a-select @change="haozhongItem($event)" v-model="gh_ghlb">
                    <a-select-option v-for ="hzItem in typesList" :key="hzItem.id" :value="hzItem.ghlbmc">{{hzItem.ghlbmc}}</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :xl="4" :lg="7" :md="8" :sm="24">
                <a-form-item label="挂号费" :required="true" :labelCol="labelCol" hasFeedback>
                  <a-input v-model="gh_price" type="input" disabled="true" />
                </a-form-item>
              </a-col>
              <a-col :xl="4" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" label="号源总数" :required="true" hasFeedback>
                  <a-input v-model="count" placeholder="号源总数" type="input"/>
                </a-form-item>
              </a-col>
              <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item
                  label="可用社保"
                  :required="true"
                  :labelCol="labelCol"
                  hasFeedback>
                  <a-radio-group v-model="isShebao">
                    <a-radio :value="0">否</a-radio>
                    <a-radio :value="1">可</a-radio>
                  </a-radio-group>
                </a-form-item>
              </a-col>
            </a-row>
          </a-form>
          <a-form layout="inline" :model='form' @keyup.enter.native="searchQuery">
            <a-row :gutter="24" v-for="(item1,index) in forms">
              <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="日期" :required="true" hasFeedback>
                  <j-date placeholder="请选择日期" v-model="item1.visitTime" :trigger-change="true" style="width: 100%"/>
                </a-form-item>
              </a-col>
              <a-col :xl="5" :lg="7" :md="8" :sm="24">
                <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="时间段" :required="true" hasFeedback >
                  <a-select v-model="item1.visitPart" @change="timeChange(item1.visitPart)">
                    <a-select-option value="全天">全天</a-select-option>
                    <a-select-option value="上午">上午</a-select-option>
                    <a-select-option value="下午">下午</a-select-option>
                    <a-select-option value="晚上">晚上</a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :xl="8" :lg="7" :md="8" :sm="24">
                <a-form-item label="门诊时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
                  <a-time-picker placeholder="门诊时间" v-model="item1.startTime" :trigger-change="true" :show-time="true" value-format="HH:mm:ss" @change="startTimeChange" style="width: 130px"/>
                  <!-- <a-time-picker v-model="item1.startTime"  :trigger-change="true" :show-time="true" value-format="HH:mm:ss" style="width: 130px" :picker-options="{selectableRange: '08:00:00 - 12:00:00'}"  placeholder="任意时间点" /> -->
                  至
                  <a-time-picker placeholder="门诊时间" v-model="item1.endTime" :trigger-change="true" :show-time="true" value-format="HH:mm:ss" style="width: 130px"/>
                </a-form-item>
              </a-col>
              <a-col :xl="2" :lg="7" :md="8" :sm="24">
                <a-button type="danger" @click="deleteHYBtn(index,item1.id)" icon="delete">删除该条数据</a-button>
              </a-col>
            </a-row>
            <a-row>
              <a-col :xl="4" :lg="7" :md="8" :sm="24">
                <a-button type="primary" @click="addHYBtn" icon="plus">添加号源</a-button>
              </a-col>
            </a-row>
          </a-form>
        </div>
      </a-card>
    </a-modal>

  </a-card>
</template>

<script>
import { httpAction, getAction,putAction } from '@api/manage'
import JDate from '@/components/jeecg/JDate'
export default {
  name: '挂号管理-添加',
  components: {
    JDate,
  },
  inject: ['reload'],

  data() {
    return {
      title: '挂号管理',
      modalMisible: false,
      value1: new Date(2016, 9, 10, 18, 40),
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      labelCols: {
        xs: { span: 12 },
        sm: { span: 8 },
      },
      wrapperCols: {
        xs: { span: 12 },
        sm: { span: 10 },
      },
      forms:[
        {
          doctorId:'',
          registerHospitalId:"",
          department:'',
          type:'',
          visitTime:'',
          visitPart:'',
          numStart: 1,
          numEnd:'',
          surplusNum:'',
          count:'',
          price:'',
          oracleGhlb:'',
          startTime:'',
          endTime:'',
          isShebao:'',
          ghGhlb:'',
          ghPrice :''
        }
      ],
      hospitals:{},  //医院信息
      // department:{},//科室信息
      form: this.$form.createForm(this),
      url: {
        add: "/doctorRegister/doctorRegister/add",
        addSave: "/doctorRegister/doctorRegister/add",
        haozhong:"/doctorRegister/doctorRegister/ghlbList",
        types:"/doctorRegister/doctorRegister/ghlbL"
      },
      doctorId:'',
      department:'',
      registerHospitalId:'',
      type:'',
      price:'',
      gh_ghlb:'',
      gh_price:'',
      ghGhlb:'',
      oracleGhlb:'',
      isShebao:'',
      strTime:'',
      count:'',
      haozhongList:[],
      typesList:[]
    }
  },
  created() {
    this.viewShow();
  },
  mounted() {
    this.haozhong();
    this.types()
  },
  methods: {
    timeChange(str){
      this.strTime = str
    },
    startTimeChange(val){
      if(this.strTime == '上午'){
        if(val <= '08:00:00' || val >= '12:00:00'){
          console.log("123")
        }
        
      }else if(this.strTime == '下午'){

      }else if(this.strTime == '晚上'){

      }
   },
    //删除该条号源del(index,id)
    deleteHYBtn(index,id){
      this.forms.splice(index,1);
    },
    haozhong(){
      console.log('11')
      getAction(this.url.haozhong,'get').then((res)=>{
        if(res.code === 200){
          this.haozhongList = res.result 
        }else{
          this.$message.warning(res.message)
        }
      }).catch((error)=>{
        console.log(error);
      })
    },
    types(){
      getAction(this.url.types,'get').then((res)=>{
        if(res.code === 200){
          this.typesList = res.result 
        }else{
          this.$message.warning(res.message)
        }
      }).catch((error)=>{
        console.log(error);
      })
    },
    //不同号种 价格
    fuwufeiItem(val){
      for(var i = 0;i<this.haozhongList.length;i++){
        if(val == this.haozhongList[i].ghlbmc){
          this.price = this.haozhongList[i].zlf
          this.oracleGhlb = this.haozhongList[i].ghlb
        }
      }
    },
    //typesList
    haozhongItem(val){
      for(var i = 0;i<this.typesList.length;i++){
        if(val == this.typesList[i].ghlbmc){
          this.gh_price = this.typesList[i].zlf
          this.ghGhlb = this.typesList[i].ghlb
          this.gh_ghlb = this.typesList[i].ghlbmc
        }
      }
    },
    // 添加号源按钮
    addHYBtn(){
      this.forms.push({
        doctorId: this.forms[0].doctorId,
        registerHospitalId: this.forms[0].registerHospitalId,
        department: this.forms[0].department,
        type: this.forms[0].type,
        visitTime: '',
        visitPart: this.forms[0].visitPart,
        numStart: 1,
        numEnd:'',
        surplusNum:'',
        count:this.forms[0].count,
        price: this.forms[0].price,
        oracleGhlb:this.oracleGhlb,
        startTime:this.forms[0].startTime,
        endTime:this.forms[0].endTime,
        isShebao:this.forms[0].isShebao,
        gh_ghlb:this.forms[0].gh_ghlb,
        gh_price:this.forms[0].gh_price
      })
    },
    toMakeAppointmentList(record) {
      var param = {"doctorId":record.id,"doctorName":record.doctorName};
      this.$router.push(`/makeAppointmentList/${record.id}`,param)
    },
    viewShow(record) {
      this.doctorId = record.id;
      this.department = record.department
      var param = {"doctorId":record.id};

      getAction(this.url.add,param).then(res => {
        console.log(res.result)
        this.hospitals = res.result.hospitals;
        this.forms.department = res.result.doctor.department;
      })

      this.modalMisible = true
    },
    //选择医院
    selectHospital(hospital){
      this.forms.registerHospitalId = hospital.id;
    },
    
    submitOk () {
      if(this.type == null || this.type == ''){
        this.type = null
      }
      if(this.price == null || this.price == ''){
        this.price = 0
      }
      this.forms.forEach(item => {
        item.doctorId = this.doctorId
        item.department = this.department
        item.count = this.count
        item.registerHospitalId = this.registerHospitalId
        item.type = this.type
        item.price = this.price
        item.oracleGhlb = this.oracleGhlb
        item.isShebao = this.isShebao,
        item.ghGhlb = this.ghGhlb,
        item.ghPrice = this.gh_price
      });
      
      if(this.checkForms(this.forms)){
        httpAction(this.url.addSave, this.forms,'post').then((res)=>{
          if(res.code === 200){
            this.$message.success(res.message)
            this.reload()
          }else{
            this.$message.warning(res.message)
          }
        }).catch((error)=>{
          console.log(error);
        })
      }
    },

    //校验表单信息
    checkForms(forms){
      if(forms.registerHospitalId == ''){
        this.$message.warning("请选择挂号医院！")
        return false
      }else if(forms.type == '') {
        this.$message.warning("请选择号种类型！")
        return false
      }else if(forms.visitTime == ''){
        this.$message.warning("请选择日期！")
        return false
      }else if(forms.visitPart == ''){
        this.$message.warning("请选择时间段！")
        return false
      }else if(forms.visitPart == ''){
        this.$message.warning("请选择时间段！")
        return false
      }else if(forms.numStart <= 0){
        this.$message.warning("开始序号有误！")
        return false
      }else if(forms.numStart >= 1000){
        this.$message.warning("开始序号不可超过1000！")
        return false
      }else if(forms.count <= 0){
        this.$message.warning("号源总数有误！")
        return false
      }else if(forms.count >= 1000){
        this.$message.warning("号源总数不可超过1000！")
        return false
      }else if(forms.price == '' || forms.price < 0){
        this.$message.warning("请输入价格或价格输入有误！")
        return false
      }else if(forms.isShebao == ''){
        this.$message.warning("请选择是否可以社保卡")
        return false
      }else{
        return true
      }
    }
  }
}
</script>

<style lang="less">
  .addHYmodel{
    padding: 0;
    & .ant-modal-body {
          padding: 0!important;
      }
  }
  .ant-modal-body {
          padding: 0 !important;
      }
  .ant-input-number {
    margin-right: 20px;
    width: 360px;
  }

  .ant-btn-danger{background-color: #ff4d4f; border-color: #ff4d4f;}
  .ant-form.ant-form-inline > .ant-row:nth-child(even){height:30px;background:#efefef;}
  // .ant-row:nth-child(even){height:30px;background:#00f;}
  // .ant-form-item:nth-child(odd){background: #eee;}
</style>